<!-- 通报记录 -->
<template>
  <div class="wrapper">
    <search-form :area="'noti'" @search="search" @handleDel="handleDel" @handleAdd="handleAdd">
    </search-form>

    <a-card :body-style="{ padding: 0 }" :bordered="false">
      <a-spin :indicator="indicator" :spinning="spinning" tip="获取数据中...">
        <div class="spin-content">
          <a-table size="small" bordered :rowKey="(record) => record.id" :columns="columns" :dataSource="tableList"
            :pagination="pagination" :rowSelection="{
      selectedRowKeys: selectedRowKeys,
      onChange: onSelectChange,
    }">
            <span slot="action" slot-scope="text, record">
              <template>
                <a size="small" type="link" @click="handleEdit(record)">编辑</a>
                <a-divider type="vertical" />
                <a size="small" type="link" @click="handleView(record)">查看</a>
              </template>
            </span>
          </a-table>
        </div>
      </a-spin>
    </a-card>
    <info-modal :actionType="action" ref="infomodal" @save="handleSave" />

  </div>
</template>

<script>
import {
  getNotificationList,
  getNotificationByID,
  saveNotification,
  delNotification,
} from "@/api/allApi";
import SearchForm from "./modules/searchform";
import InfoModal from './modules/notiModal.vue'
const columns = [
  {
    title: "监管对象",
    dataIndex: "SupervisionObjectName",
    key: "SupervisionObjectName",
    align: "center",
  },
  {
    title: "通报类型",
    dataIndex: "NotificationTypeName",
    key: "NotificationTypeName",
    align: "center",
  },
  {
    title: "通报时间",
    dataIndex: "notificationTime",
    key: "notificationTime",
    align: "center",
  },
  // {
  //   title: "具体情况及措施",
  //   dataIndex: "visitPersonRelationship",
  //   key: "visitPersonRelationship",
  //   align: "center",
  // },
  {
    title: "增加时间",
    dataIndex: "addTime",
    key: "addTime",
    align: "center",
  },

  {
    title: "最后修改日期",
    dataIndex: "updateTime",
    key: "updateTime",
    align: "center",
  },
  {
    title: "操作",
    width: "150px",
    dataIndex: "action",
    scopedSlots: { customRender: "action" },
    align: "center",
  },
];
export default {
  name: "",
  components: { SearchForm, InfoModal },
  props: [],
  data() {
    return {
      columns: columns,
      action: "add",
      indicator: <a-icon type="loading" style="font-size: 24px" spin />,
      spinning: false,
      tableList: [],
      queryParam: {
        index: 1,
        pageSize: 10,
      },
      selectedRowKeys: [],
      pagination: {
        onChange: (index, pageSize) => {
          this.pageOnChange(index, pageSize);
        },
        current: 1,
        total: 0,
        showQuickJumper: true,
        size: "small",
        defaultPageSize: 10,
        showTotal: (total) => `共 ${total} 条数据`,
        showSizeChanger: true,
        pageSizeOptions: ["5", "10", "15", "20"],
        onShowSizeChange: (index, pageSize) => {
          this.pageOnChange(index, pageSize);
        },
        position: "bottom",
      },
    };
  },
  computed: {},
  watch: {},
  created() { },
  mounted() {
    this.initData(this.queryParam)
  },
  methods: {
    async initData(params) {
      this.spinning = true;
      const { data, message, page } = await getNotificationList({ ...params });
      this.pagination.total = page.RecordCount;
      this.tableList = data;
      this.tableList.map((a) => {
        a.notificationTime = this.$moment(a.notificationTime).format('YYYY-MM-DD');
        a.addTime = this.$moment(a.addTime).format('YYYY-MM-DD HH:mm:ss');
        a.updateTime = this.$moment(a.updateTime).format('YYYY-MM-DD HH:mm:ss');
        // a.isExamine = a.isExamine === true ? "是" : "否";
        // a.isComplete = a.confirmUserID > 0 ? "是" : "否";
      });
      this.spinning = false;
    },

    search(data) {
      Object.assign(this.queryParam, data, { index: 1 });
      this.pagination.current = 1;
      this.initData(this.queryParam);
    },
    /** 选择框 */
    onSelectChange(selectedRowKeys) {
      // console.log('selectedRowKeys changed: ', selectedRowKeys)
      this.selectedRowKeys = selectedRowKeys;
    },
    // 添加
    handleAdd() {
      this.action = "add";
      this.$refs.infomodal.view();
    },
    //添加保存接口
    async handleSave(values) {
      const { code, message } = await saveNotification(values)

      this.$message.success(message)
      this.$refs.infomodal.closeModal()
      this.initData(this.queryParam)
    },
    //编辑
    async handleEdit(row) {
      this.spinning = true;
      this.action = "edit";
      const { code, data } = await getNotificationByID({ id: row.id })

      this.$refs.infomodal.view(data);
      this.spinning = false;
    },

    // 查看详情
    async handleView(row) {
      this.spinning = true;
      this.action = "view";
      const { code, data } = await getNotificationByID({ id: row.id })
      this.spinning = false;

      this.$refs.infomodal.view(data);

    },

    /**
     * 批量删除
     */
    async handleDel() {
      this.spinning = true;
      const { code, message } = await delNotification(this.selectedRowKeys);
      this.spinning = false;
      this.selectedRowKeys = [];
      this.initData(this.queryParam);

      this.$message.success(message);

    },

    pageOnChange(index, pageSize) {
      this.spinning = true;
      Object.assign(this.pagination, {
        current: index,
        pageSize,
        index,
      });
      Object.assign(this.queryParam, {
        pageSize,
        index,
      });
      this.initData(this.queryParam);
    },
  },
};
</script>
<style>
/** lang='less' scoped */
</style>